<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
	<style type="text/css">
.ui-widget-content {
	padding: 0px !important;
}

.colunaSaldoConta {
	text-align: right;
	width: 50px;
}
</style>

	<script language="javascript">
	</script>

</h:head>
<h:form id="formEsquerda" prependId="false">
	<p:panel header="Contas" closable="false" id="panelContas"
		style="height:200px;">

		<f:facet name="header">

			<table style="width: 100%" cellpadding="0" cellspacing="0" border="0">

				<tr>
					<td>Contas</td>
					<td align="right"><p:commandLink oncomplete="dlgConta.show();"
							process="@this" update=":formConta"
							action="#{manterContaMB.doAdicionarAction}">
							<h:graphicImage url="/imgs/add.png"></h:graphicImage>
						</p:commandLink></td>
				</tr>
			</table>
		</f:facet>

		<table cellpadding="0" cellspacing="0" border="0" style="width: 100%">
			<ui:repeat var="conta" value="#{manterContaMB.listaContas}">
				<tr>
					<td><p:commandLink oncomplete="dlgConta.show();"
							process="@this" update=":formConta"
							action="#{manterContaMB.doEditarAction}">
							<h:outputText value="#{conta.nome}" />

							<f:setPropertyActionListener target="#{manterContaMB.entidade}"
								value="#{conta}" />
						</p:commandLink></td>

					<h:panelGroup rendered="#{conta.saldoCalculado lt 0}">
						<td class="colunaSaldoConta"><h:outputText
								style="color:red; font-weight:bold;"
								value="#{conta.saldoCalculado}">
								<f:convertNumber type="currency" currencySymbol="" />
							</h:outputText></td>
					</h:panelGroup>
					<h:panelGroup rendered="#{conta.saldoCalculado ge 0}">
						<td class="colunaSaldoConta"><h:outputText
								value="#{conta.saldoCalculado}">
								<f:convertNumber type="currency" currencySymbol="" />
							</h:outputText></td>
					</h:panelGroup>
				</tr>
			</ui:repeat>
		</table>
	</p:panel>
	<p:panel id="panelCateg" header="Categorias">

		<div>
			<p:commandLink oncomplete="dlgCategoria.show();" process="@this"
				update=":formCategoria"
				action="#{manterContaMB.doAdicionarCategoriaTransacaoAction}">
					Debito<h:graphicImage url="/imgs/add.png"></h:graphicImage>

				<f:setPropertyActionListener target="#{manterContaMB.tipoCategoria}"
					value="DEBITO" />
			</p:commandLink>
		</div>

		<p:tree id="tree" value="#{manterContaMB.treeCategoria}"
			style="width:194px;" var="categoria" >
			<p:treeNode id="treeNode">
				<h:outputText value="#{categoria.nome}" />
				<p:commandLink oncomplete="dlgCategoria.show();" process="@this"
					update=":formCategoria"
					action="#{manterContaMB.doAdicionarCategoriaTransacaoAction(categoria)}">
					<h:outputText value=" + " />
					<f:setPropertyActionListener
						target="#{manterContaMB.tipoCategoria}" value="DEBITO" />
				</p:commandLink>
			</p:treeNode>
		</p:tree>

		<div>
			<p:commandLink oncomplete="dlgCategoria.show();" process="@this"
				update=":formCategoria"
				action="#{manterContaMB.doAdicionarCategoriaTransacaoAction}">
					Crédito<h:graphicImage url="/imgs/add.png"></h:graphicImage>

				<f:setPropertyActionListener target="#{manterContaMB.tipoCategoria}"
					value="CREDITO" />
			</p:commandLink>
		</div>
	</p:panel>

</h:form>
<p:dialog header="Manter conta" widgetVar="dlgConta" modal="true"
	appendToBody="true">
	<h:form id="formConta" prependId="false">
		<table style="width: 350px">
			<tr>
				<td>Tipo:</td>
				<td colspan="3"><p:selectOneMenu id="cboTipoConta"
						style="width:207px;" value="#{manterContaMB.tipoConta}">
						<f:selectItems value="#{aplicacaoMBean.listaTipoConta}"
							var="tipoConta" itemLabel="#{tipoConta.descricao}"
							itemValue="#{tipoConta}" />

						<p:ajax event="change" update="formConta" process="cboTipoConta"
							listener="#{manterContaMB.tipoContaAlterado}" />

					</p:selectOneMenu></td>
			</tr>

			<tr>
				<td>Nome:</td>
				<td colspan="3" align="right">
				<h:outputText value="#{manterContaMB.entidade.id} - " rendered="#{not empty manterContaMB.entidade.id }" />
				<p:inputText
						value="#{manterContaMB.entidade.nome}" style="width:200px;"></p:inputText></td>
			</tr>

			<tr>
				<td>Saldo:</td>
				<td align="right"><p:inputText style="width:70px;"
						value="#{manterContaMB.entidade.saldo}">
						<f:convertNumber pattern="#,##0.00" minFractionDigits="2" />
					</p:inputText></td>
				<td>Limite:</td>
				<td align="right"><p:inputText style="width:70px;"
						value="#{manterContaMB.entidade.limite}">
						<f:convertNumber pattern="#,##0.00" minFractionDigits="2" />
					</p:inputText></td>
			</tr>

			<h:panelGroup
				rendered="#{manterContaMB.entidade['class'].simpleName == 'ContaCredito'}">
				<tr>
					<td>Dia fechamento:</td>
					<td><p:inputText size="3"
							value="#{manterContaMB.entidade.diaFechamentoFatura}"></p:inputText></td>

					<td>Dia vencimento:</td>
					<td><p:inputText size="3"
							value="#{manterContaMB.entidade.diaVencimentoFatura}"></p:inputText></td>
				</tr>
			</h:panelGroup>

			<tr>
				<td colspan="4"><p:separator
						style="margin-top:10px; margin-bottom:5px;" height="2" /></td>
			</tr>
			<tr>
				<td><p:commandButton value="Cancelar" type="button"
						onclick="dlgConta.hide();" /></td>
				<td colspan="3" align="right">
				<p:commandButton
						oncomplete="dlgConta.hide();" value="Salvar" process="@this formConta"
						update=":formEsquerda:panelContas"
						action="#{manterContaMB.doSalvarAction}">
				</p:commandButton></td>
			</tr>
		</table>
	</h:form>
</p:dialog>

<p:dialog header="Adicionar categoria" widgetVar="dlgCategoria"
	modal="true" appendToBody="true">
	<h:form id="formCategoria" prependId="false">
		#{manterContaMB.tipoCategoriaEnum.descricao}
		<table style="width: 300px">

			<tr>
				<td><h:outputText value="Categoria Pai: "
						rendered="#{manterContaMB.categoriaTransacao.categoriaPai ne null}" />
				</td>
				<td align="right"><h:outputText
						rendered="#{manterContaMB.categoriaTransacao.categoriaPai ne null}"
						value="#{manterContaMB.categoriaTransacao.categoriaPai.nome}" />
				</td>
			</tr>

			<tr>
				<td>Nome:</td>
				<td align="right"><p:inputText style="width:150px;"
						value="#{manterContaMB.categoriaTransacao.nome}">
					</p:inputText></td>
			</tr>

			<tr>
				<td colspan="4"><p:separator
						style="margin-top:10px; margin-bottom:5px;" height="2" /></td>
			</tr>
			<tr>
				<td><p:commandButton value="Cancelar" type="button"
						onclick="dlgCategoria.hide();" /></td>
				<td colspan="3" align="right"><p:commandButton
						oncomplete="dlgCategoria.hide();" value="Salvar"
						update=":formEsquerda:tree" process="formCategoria"
						action="#{manterContaMB.doSalvarCategoriaAction}"></p:commandButton></td>
			</tr>
		</table>
	</h:form>
</p:dialog>

</html>